import { Component } from 'react';
import React from 'react';
import { connect } from 'umi';
import HighPerformTable from '@/components/HighPerformTable';
import APIS from '@/apis';
import { PlusOutlined } from '@ant-design/icons';
import { Button } from 'antd';
import { FormInstance } from 'antd/lib/form';
import DocumentUpload from '@/components/DocumentUpload';

class VRLessonDocument extends Component<any, any> {
    actionRef: any;
    requestGetData(
        params: {
            pageSize?: number;
            current?: number;
        },
        sorter: {
            [key: string]: 'ascend' | 'descend';
        },
        filter: {
            [key: string]: React.ReactText[];
        },
    ) {
        return APIS.CourseAPI.GetVRLessonDocList({ ...params, sorter, filter,lessonId:this.props.lessonId });
    }
    handleUpdateModalVisible(value: boolean) { }
    clomns: any = [
        {
            title: '名称',
            dataIndex: 'title',
        },
        {
            title: '文件路径',
            dataIndex: 'docPath',
            renderFormItem: (item: any, config: any, form: FormInstance)=>{
                return <DocumentUpload preDoc={config.value} handleDocChange={(url:any)=>form.setFieldsValue({docPath:url})}></DocumentUpload>
            }
        },
        {
            title: '更新时间',
            dataIndex: 'updatedTime',
            hideInForm: true,
        },
    ];
    render() {
        return (
            <div>
                <HighPerformTable<any>
                    columns={this.clomns}
                    requestGetData={this.requestGetData.bind(this)}
                    ref={(ref) => (this.actionRef = ref)}
                    handleChangeState={(data, state) => {
                        return APIS.CourseAPI.ChangeVRLessonDocState({ id: this.props.chapterId, state: state === true ? 1 : 0 })
                    }}
                    onClickUpdate={record => this.actionRef.handleUpdateModalVisible(true, record)}
                    handleUpdate={record => { return APIS.CourseAPI.UpdateVRLessonDoc(record) }}
                    handleDelete={id => { return APIS.CourseAPI.DeleteVRLessonDoc(id) }}
                    toolBarRender={() => [
                        <Button type="primary" onClick={() => this.actionRef.handleModalVisible(true)}>
                            <PlusOutlined /> 新增文档
                        </Button>
                    ]}
                    handleAdd={data => { return APIS.CourseAPI.CreateVRLessonDoc({...data,vrLessonId:this.props.lessonId}) }}
                />
            </div>
        );
    }
}

export default connect()(VRLessonDocument);
